import { useRole } from '@/hook/useRole';
import { Space, Table, Tag, Card, Tooltip } from 'antd';
import TableCard from '@/components/card/tablecard'
function App() {
    // 获取角色信息
    const { list, loading,setParams,params } = useRole()

    const columns = [
        {
            title: '角色名',
            dataIndex: 'roleName',
            key: 'roleName',
        },
        {
            title: '备注',
            dataIndex: 'remark',
            key: 'remark',
        },
        {
            title: '状态',
            dataIndex: 'roleStatus',
            key: 'roleStatus',
            render: ({ roleStatus }) => {
                // 0正常 1禁用
                let color = roleStatus ? 'volcano' : 'geekblue';
                return (
                    <Tag color={color} key={roleStatus}>
                        {!roleStatus ? '正常' : '禁用'}
                    </Tag>
                )
            }
        },
        {
            title: '角色类型',
            key: 'roleType',
            dataIndex: 'roleType',
            render: (_, { roleType }) => {
                // 1 平台角色 2门店角色
                let color = roleType ? 'geekblue' : 'green';
                return (
                    <Tag color={color} key={roleType}>
                        {roleType ? '平台角色' : '门店角色'}
                    </Tag>
                )
            }

        },
        {
            title: '创建时间',
            key: 'createTime',
            dataIndex: 'createTime',
            ellipsis: {
                showTitle: false,
            },
            render: createTime => (
                <Tooltip placement="topLeft" title={createTime}>
                    {createTime}
                </Tooltip>
            ),
        },
        {
            title: '操作',
            key: 'action',
            render: (_, record) => (
                <Space size="middle">
                    <a>编辑</a>
                    <a>删除</a>
                </Space>
            ),
        },
    ];
    const getParamsVal=(v)=>{
        console.log(v);
        setParams({
            ...params,
            roleName:v.name
        })
    }
    return (
        <>
            <TableCard btnLabel="角色" getParamsVal={getParamsVal} ></TableCard>
            <Card
                style={{ width: '100%' }}
            >
                <Table loading={loading} columns={columns} rowKey="id" dataSource={list} />

            </Card>
        </>
    )

}
export default App;